<template>
	<div id="regist_body">
		<div id="regist">
			<div class="loginTop ">
				<div class="top_left my-flex-left">
					<img src="../../assets/login/icon_logo_login.png" />
					<div class="name first">
						<div class="cn">
							比价网
						</div>
						<div class="en">
							bijia.com
						</div>
					</div>
					<div class="login_line"></div>
					<div class="name desc">
						<div class="cn">
							找回秘密
						</div>
						<div class="en">
							retrieve password
						</div>
					</div>
				</div>
			</div>
			<div class="regist_content my-flex-col-center ">

				<div class="info_panel">
					<el-form label-width="145px" style="">
						<div class="login_type my-flex-center">
							<el-form-item label="">
								<div class="type_select regist_type my-flex-between">
									<label class="label" v-for="item in registType" @click="changeType(item.id)">
								<input type="radio" name="type" v-model="currentType" :value="item.id" />
								<div class="img"></div><span>{{item.value}}</span>							
							</label>
								</div>
							</el-form-item>
						</div>
						<el-form-item label="手机号：">
							<el-input v-model="loginForm.tel" @blur="companySelect" placeholder="请输入手机号码"></el-input>
						</el-form-item>
						<el-form-item label="公司：" v-if="currentType=='customer'">
							<el-select v-model="loginForm.realName" placeholder="选择公司">
								<el-option v-for="item in companyList" :key="item.realName" :label="item.realName" :value="item.realName">
								</el-option>
							</el-select>
						</el-form-item>
						<el-form-item label="验证码：" class="code">
							<el-input class="getCode" maxlength="6" v-model="loginForm.code" placeholder="请输入验证码"></el-input>
							<getvalidate :userType="userType" :userCurrentType="userCurrentType" :tel="loginForm.tel" :realName="loginForm.realName" :type='2' class="btn-default"></getvalidate>

						</el-form-item>
						<el-form-item label="新密码：">
							<el-input v-model="loginForm.pwd" type="password" :maxlength="10" placeholder="请输入密码"></el-input>
						</el-form-item>
						<el-form-item label="确认新密码：">
							<el-input v-model="loginForm.confirmPwd" type="password" :maxlength="10" placeholder="请再次确认密码"></el-input>
						</el-form-item>
						<el-form-item label="">
							<div class="submit my-flex-center" @click="confirm">提交</div>
						</el-form-item>
					</el-form>
				</div>
			</div>

		</div>
	</div>
</template>

<script>
	import service from '@/js/common/customerservice.js';
	import getvalidate from '@/components/code/verifycode.vue'
	export default {
		components: {
			getvalidate
		},
		data() {
			return {
				registType: [{
					id: 'personRegister',
					value: '个人买家'
				}, {
					id: 'customer',
					value: '企业买家'
				}],
				currentType: 'personRegister',
				userType: 'personRegister',
				loginForm: {
					tel: '',
					realName: '',
					code: '',
					pwd: '',
					confirmPwd: '',
					bos: true,
					timeStatus: false
				},
				compShow: false,
				userCurrentType: 0,
				companyList: [],
				formVisible: false,
			}
		},
		watch: {

		},
		mounted() {

		},
		methods: {
			...service,
			changeType(id) {
				console.log(id);
				this.currentType = id;
				this.userType = id;
				if(this.userType == 'personRegister') {
					this.loginForm.bos = true;
				} else {
					this.loginForm.bos = false;
				}
			},
			confirm() {
				this.resetPassword();
			},
			companySelect() {
				var self = this;
				if(self.loginForm.tel.length == 11 && this.currentType == 'customer') {
					var telReg = /^[1][3,4,5,7,8][0-9]{9}$/;
					if(!telReg.test(self.loginForm.tel)) {
						return false;
					}
					this.getCompanyName();
				}
			},

		},
	}
</script>

<style src="../../less/page/common/regist.less" lang="less"></style>